<template>
  <s-layout
    class="set-wrap"
    navbar="custom"
    tabbar="/pages/yy/index"
    title="首页"
    :bgStyle="{ color: '#f7f7f7' }"
    onShareAppMessage
    :showFloatButton="true"
  >
    <s-empty v-if="state.list.length === 0 && !state.loading" text="暂无常见问题" icon="/static/collect-empty.png" />
    <view class="flex flex-col gap-4 p-4">
      <view class="flex gap-3 items-center">
        <view class="w-[36px] h-[36px]">
          <image src="/static/13154543076.png" mode="scaleToFill" class="size-full" />
        </view>
        <view class="text-[18px] text-[#382B2B] flex-none font-bold">峨眉派</view>
        <view class="rounded-full bg-[#FFFFFF] p-2 flex-1 pl-4 flex items-center justify-between gap-4">
          <input placeholder="快速寻找商品" class="text-[13px] text-[#8B88AB] flex-1 h-full" v-model="state.keyword" />
          <view class="rounded-full bg-[#0788C8] h-full px-4 py-2">
            <view class="text-[16px] text-[#FFFFFF]"> 搜索</view>
          </view>
        </view>
      </view>
    </view>
    <!-- <view class="py-5"></view>
    <view class="fixed right-0 bottom-0 left-0 p-4 bg-white">
      <view class="overflow-hidden py-3 w-full rounded-lg bg-[#0788C8] grid place-items-center">
        <view class="font-medium text-[16px] text-[#FFFFFF]"> 确认修改 </view>
      </view>
    </view> -->
  </s-layout>
</template>

<script setup>
  import { showShareModal } from '@/sheep/hooks/useModal';
  import sheep from '@/sheep';

  import $share from '@/sheep/platform/share';
  const state = ref({
    active: 0,
    tabList: [
      {
        name: '全部',
      },
      {
        name: '商品',
      },
      {
        name: '服务',
      },
      {
        name: '服务',
      },
      {
        name: '服务',
      },
      {
        name: '服务',
      },
      {
        name: '服务',
      },
    ],
    swiperList: [
      {
        image: 'https://cd.sealmg.com/uploads/20250819/62bab63fd4ea9f8e2da8edcae62ac8f6.webp',
      },
      {
        image: 'https://cd.sealmg.com/uploads/20250819/62bab63fd4ea9f8e2da8edcae62ac8f6.webp',
      },
      {
        image: 'https://cd.sealmg.com/uploads/20250819/62bab63fd4ea9f8e2da8edcae62ac8f6.webp',
      },
    ],
    keyword: '',
    list: [],
    loading: true,
  });

  // 隐藏原生tabBar
  uni.hideTabBar({
    fail: () => {},
  });

  const template = computed(() => sheep.$store('app').template?.home);

  onLoad((options) => {
    // #ifdef MP
    // 小程序识别二维码
    if (options.scene) {
      const sceneParams = decodeURIComponent(options.scene).split('=');
      options[sceneParams[0]] = sceneParams[1];
    }
    // #endif

    // 预览模板
    if (options.templateId) {
      sheep.$store('app').init(options.templateId);
    }

    // 解析分享信息
    if (options.spm) {
      $share.decryptSpm(options.spm);
    }

    // 进入指定页面(完整页面路径)
    if (options.page) {
      sheep.$router.go(decodeURIComponent(options.page));
    }
  });
  function getList() {}

  function handleChange(index) {
    state.value.active = index;
    getList();
  }
</script>

<style lang="scss" scoped></style>
